?【Vue.js → Nuxt 入門推薦！??新書即將上市 ?】
?《想要 SSR 嗎？就使用 Nuxt 吧！Nuxt 讓 Vue.js 更好處理 SEO 搜尋引擎最佳化》
? Nuxt v4 內容與範例也可以參考並購買本系列文筆著所著書籍
? 預計於 2025/08/14 出版，目前天瓏書局預購有 7??8?? 折優惠
? 點此前往購買：https://pse.is/7yulwm

注意：Nuxt 4 已於 2025/07/16 釋出，本文部分內容或範例可能和最新版本有所不同

?建議你可以使用影片子母畫面功能或全螢幕播放來獲得最佳的觀賞體驗，?下方是本篇教學的相關筆記。

建構打包專案

使用 Nuxt CLI 的 build 指令來進行 Nuxt 3 網站的建構打包

npm run build

# 或者你也可以使用
npx nuxi@latest build

在本地測試打包好的網站

使用 Node.js 執行打包完成的入口檔案 .output/server/index.mjs。

node .output/server/index.mjs

如果你的專案中有使用 .env 檔案建立環境變數，你可以使用 DotEnv 來協助載入。

node -r dotenv/config .output/server/index.mjs

部署前的檢查

• UI 與流程邏輯
• 網頁標題 (Title) 與網頁圖示 (favicon)
• 使用到的圖片、字型或外部資源是否經過授權及可以商用
• 每個頁面中的 Meta Tags 及 SEO 搜尋引擎最佳化的設定
• 不同裝置與瀏覽器的 RWD 或相容性測試
• 測試內部或外部的 API 是否正常運作
• 測試使用的密鑰、憑證或最高權限等記得移除
• 資安相關評估與測試
• .env 檔案與環境變數的設置

感謝大家的閱讀，歡迎大家給予建議與討論，也請各位大大鞭小力一些：）
如果對這個 Nuxt 3 系列感興趣，可以訂閱接收通知，也歡迎分享給喜歡或正在學習 Nuxt 3 的夥伴。

範例程式碼

• Nuxt 3 實戰部落格範例程式碼